<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <title>学生成绩表格导出excel</title>
    <meta charset='utf-8'>

    <script src="../static/js/jquery.min.js"></script>
    <script src="../static/js/echarts.common.min.js"></script>
    <script src="../static/js/echartsOne.js"></script>
    <link rel="stylesheet" href="../static/css/jquery.datatables.min.css"/>
    <link rel="stylesheet" href="../static/css/buttons.dataTables.min.css"/>
    <link rel="shortcut icon" href="../resources/favicon.ico" th:href="@{/static/favicon.ico}"/>
    <style>
        tbody td {
            text-align: center;
        }
    </style>


</head>
<body>
<!-- //图形 -->
<h1 style="margin-left: 40%;">学生成绩信息</h1>
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<h3>

    <select id="class">
        <option th:value="1">计一</option>
        <option th:value="2">软二</option>
        <option th:value="3">软三</option>
        <option th:value="4">软四</option>

    </select>
    <button id="qxfl" data-index="1">查询</button>
    <button id="gfzr" data-index="2">年级成绩</button>
</h3>

<div id="main" style="width: 800px;height:300px;"></div>

<script type="text/javascript">
    $(function () {
        //直接执行
        qxfl('#qxfl');
        //班级
        $("#qxfl").click(function () {
            qxfl(this);
            var tip = document.getElementById("class");
            alert(tip.value);
        })
        //年级
        $("#gfzr").click(function () {
            qxfl(this);
        })
    });
</script>
</div>
<!-- 表格 -->
<table id="example" class="display" role="grid" aria-describedby="example_info">
    <thead>
    <tr>
        <th>ID</th>
        <th>姓名</th>
        <th>课程</th>
        <th>成绩</th>
        <th>班级</th>
    </tr>
    </thead>
    <tbody>
    <tr th:each="item:${gradeList}">
        <td th:text="${item.getS_id()}"></td>
        <td th:text="${item.getS_name()}"></td>
        <td th:text="${item.getCou_name()}"></td>
        <td th:text="${item.getG_grade()}"></td>
        <td th:text="${item.getCla_name()}"></td>
    </tr>
    </tbody>
    <tfoot>
    <tr>
        <th>学生ID</th>
        <th>学生姓名</th>
        <th>课程</th>
        <th>成绩</th>
        <th>授课教师</th>
    </tr>
    </tfoot>
</table>
<input type="hidden">
<script src="../static/js/jquery.min.js"></script>
<script src="../static/js/jquery.datatables.min.js"></script>
<script src="../static/js/dataTables.buttons.min.js"></script>
<script src="../static/js/jszip.min.js"></script>
<script src="../static/js/buttons.html5.min.js"></script>
<script src="../static/js/buttons.flash.min.js"></script>
<script src="../static/js/pdfmake.min.js"></script>
<script src="../static/js/vfs_fonts.js"></script>
<script src="../static/js/buttons.print.min.js"></script>
<script>
    $(document).ready(function () {
        $('#example').DataTable({
            dom: 'Bfrtip',
            language: {
                emptyTable: '没有数据',
                loadingRecords: '加载中...',
                processing: '查询中...',
                search: '检索:',
                lengthMenu: '每页 _MENU_ 件',
                zeroRecords: '没有数据',
                paginate: {
                    'first': '第一页',
                    'last': '最后一页',
                    'next': '下一页',
                    'previous': '上一页'
                },
                info: '第 _PAGE_ 页 / 总 _PAGES_ 页',
                infoEmpty: '没有数据',
                infoFiltered: '(过滤总件数 _MAX_ 条)',
            },
            buttons: [
                // 	{
                // 	extend: 'copyHtml5',
                // },
                {
                    extend: 'excelHtml5',
                    title: 'Data export'
                },
                {
                    extend: 'pdfHtml5',
                    title: 'Data export'
                },
                // {
                // 	extend: 'csvHtml5',
                // 	title: 'Data export'
                // },
                // {
                // 	extend: 'print',
                // }
            ]
        });

        // $(".buttons-copy").text('复制');
        $(".buttons-excel").text('导出到excel');
        $(".buttons-pdf").text('导出到pdf');
        // $(".buttons-csv").text('导出到csv');
        // $(".buttons-print").text('打印');
    });
</script>
</body>
</html>
